<template>
	<view>
		<view class="wrap">
			<unifab @dragClick="refresh" creatTop="50" creatLeft="85" image="../../static/refresh.png" imageWidth="60upx"></unifab>
			<unifab @dragClick="createScene" creatTop="60" creatLeft="85" image="../../static/jia.png" imageWidth="60upx">
			</unifab>
			<unifab @dragClick="createSceneByScan" creatTop="70" creatLeft="85" image="../../static/saoma.png" imageWidth="60upx">
			</unifab>

			<z-paging ref="pagingzhipai" v-model="dataAdminList" @query="queryAllList" auto-show-back-to-top="true">
				<cu-custom bgColor="bg-gradual-blue" :isBack="false">
					<block slot="content">维修工单</block>
				</cu-custom>
				
				<!-- 头部开始 -->
				<view class="goods-header-wrap">
					<view v-if="IsVerify" class="goods-header-item goods-header-item-action" :class="{'goods-header-item-active' :4 == goodsNav}" @click="setNav(4)">
						<view v-if="verifyCount>0" class="cu-tag badge">{{verifyCount}}</view>待审核
					</view>
					<view class="goods-header-item goods-header-item-action" :class="{'goods-header-item-active' : 1 == goodsNav}" @click="setNav(1)">
						<view v-if="showDaiBan>0" class="cu-tag badge">{{showDaiBan}}</view>我的待办
					</view>
					<view v-if="showWorkOrderPool" class="goods-header-item goods-header-item-action" :class="{'goods-header-item-active' : 3 == goodsNav}" @click="setNav(3)">
						<view v-if="showWorkOrder>0" class="cu-tag badge">{{showWorkOrder}}</view>工单池
					</view>
					<view class="goods-header-item" :class="{'goods-header-item-active' : 2 == goodsNav}" @click="setNav(2)">所有工单
					</view>
				</view>
				
				<sl-filter :themeColor="themeColor" :menuList="menuList" @result="result" @resetMenuList="resetMenuList"></sl-filter>
					<view v-if="dataAdminList.length>0" class="page-box" v-for="(item,index) in dataAdminList">
						<view class="order">
							<view  @click="goClass(item.Id,'end')">
								<view class="top">
									<view class="left">
										<uni-text class="cuIcon-titles text-blue"></uni-text>
										<view class="store">{{ item.SceneNumber }}</view>
									</view>
									<view class="right">
										<view class="progressBox">
											<view class="btn">{{item.StatusName}}</view>
										</view>
									</view>
								</view>
								<view class="item">
									<view class="left">
									</view>
									<view class="content">
										<view class="title u-line-2 text-bold"><text class="bxImg cuIcon-circle text-grey"></text>{{ item.QrcodeName }}</view>
										<view v-if="item.QrcodeAreaName!=null&&item.QrcodeAreaName!=''"  class="title u-line-2 text-bold"><text class="bxImg cuIcon-location text-grey"></text>{{ item.QrcodeAreaName }}</view>
										<view class="title u-line-2 text-bold"><text class="bxImg cuIcon-form text-grey"></text>{{ item.Desc }}</view>
										<view class="title u-line-2 text-bold"><text class="bxImg cuIcon-my text-grey"></text>{{ item.AddUserName }}</view>
										<view v-if="false">
											<view v-if="item.ProjectName!=null&&item.ProjectName!=''" class="title u-line-2 text-bold">
												<text class="bxImg cuIcon-edit text-grey"></text>项目：{{ item.ProjectName }}
											</view>
										</view>
										<view class="title u-line-2 text-bold"><text class="bxImg cuIcon-time text-grey"></text>{{ item.AddTime }}</view>
									</view>
								</view>
								<u-line color="#f1f1f1" margin="24rpx 0 15rpx 0"></u-line>
							</view>
							<view class="bottom">
								<view @click="goWhere(jtem.Value,item.Id,item.QrcodeId)" v-for="(jtem,indexc) in item.SceneButtonList" class="btnBox">
									<view class="evaluate btn">{{jtem.Title}}</view>
								</view>
							</view>
						</view>
					</view>
					<view style="height: 100rpx;width: 100%;"></view>
			</z-paging>
		</view>
		<ba-tree-picker ref="treePicker" :multiple='true' :showAll='false' @select-change="selectAssign" title="选择部门/人员"
		     :localdata="treeUserList" valueKey="id" textKey="name" childrenKey="children" />
	</view>
</template>

<script>
import request1 from '@/common/request.js';
import unifab from "@/components/beyondGod-drag/beyoundGod-drag.vue";	
export default {
	components: {
			unifab
		},
	data() {
		return {
			IsVerify:false,
			isSceneAcceptSign:0,
			showWorkOrderPool:false,
			sceneAssignId:'',
			show: false, //是否显示
			userlist: [
			], //数据源
			defaultSelected: [], //默认选中项,
			treeUserList:[
			],
			menuList: [{
					'title': '状态',
					'detailTitle': '状态',
					'isMutiple': false,
					'key': 'sceneStatus',
					//1待指派，2待处理，5待验收，3 待结案（验收通过） ，4已结案， 95验收不通过， 96 撤回，97 被驳回,98 已评论
					'detailList': [{
							'title': '不限',
							'value': '0'
						},
						{
							'title': '待指派/接单',
							'value': '1'
						},
						{
							'title': '待处理',
							'value': '2'
						},
						{
							'title': '维修中',
							'value': '6'
						},
						{
							'title': '待验收',
							'value': '5'
						},
						{
							'title': '待结案',
							'value': '3'
						},
						{
							'title': '已结案',
							'value': '4'
						},
						{
							'title': '验收不通过',
							'value': '95'
						},
						{
							'title': '撤回',
							'value': '96'
						},
						{
							'title': '被驳回',
							'value': '97'
						},
						{
							'title': '已评论',
							'value': '98'
						}
					]
			
				},
				{
						'title': '上报人',
						'detailTitle': '上报人员',
						'isMutiple': false,
						'key': 'user',
						'detailList': [{
								'title': '不限',
								'value': '0'
							}
						]
				
				},
				{
					'title': '点位',
					'detailTitle': '维修点位',
					'isMutiple': false,
					'key': 'qrcode',
					'detailList': [{
							'title': '不限',
							'value': '0'
						}
					]
				},
				{
					'title': '时间',
					'detailTitle': '时间',
					'isMutiple': false,
					'key': 'timeList',
					'detailList': [{
							'title': '近三个月',
							'value': '3m'
						}
					]
				}
			],
			themeColor: '#0079FE',
			authMessage:'',
			activeColor: '#0081ff',
			getData:{
				pageindex:1,
				pagesize:99,
				status:-1,
				adduser:-1,
				handeluser:-1,
				qrcodeid:-1,
				type:1,
				//projectId:-1,
				timeList:'3m'
			},
			orderList: [[]],
			dataList: [
			],
			dataAdminList: [
			],
			dataJieAnList: [
			],
			dataIsEndList:[],
			list: [
				{
					name: '待指派/接单'
				},
				{
					name: '待处理'
				},
				{
					name: '待验收'
				},
				{
					name: '待结案'
				},
				{
					name: '已完结'
				},
			],
			current: 0,
			swiperCurrent: 0,
			tabsHeight: 0,
			dx: 0,
			goodsNav: 1,
			showDaiBan:0,
			showWorkOrder:0,
			verifyCount:0
		};
	},
	mounted() {
		let that=this
		//console.log('mounted')
		//获取登录用户缓存 
		//2025-04后删除
		uni.getStorage({
			key: 'userdata',
			success: function (res1) {
				that.isSceneAcceptSign=res1.data.isSceneAcceptSign;
			}
		});
		
		that.getSearchOptions();
		that.GetSceneIndexConfig();
		//that.GetUserRole();
		
		
		
		//获取工单超链接字段，只要有值，就要对应做跳转
		uni.getStorage({
			key: 'SceneLink',
			success: function (res1) {
				let sceneId=res1.data.sceneId
				let type=res1.data.type
				if(type=='goSceneDetail'){
					that.goClass(sceneId,'end')
					uni.removeStorageSync("SceneLink"); 
				}
			}
		});
	},
	computed: {
	},
	onLoad() {
		
	},
	onShow(){
	},
	methods: {
		GetUserRole(){
			let that=this
			let opts = {
				url: 'SpareApi/GetUserRole',
				method: 'get'
			}
			request1.httpTokenRequest(opts).then(res => {
				if(res.data.code == 1){
					that.showWorkOrderPool=res.data.data
					//console.log('goodsNav:'+that.goodsNav)
					//that.goodsNav 3
					if(!res.data.data){
						that.setNav(that.goodsNav)
					}
				}
			});
		},
		GetSceneIndexConfig(){
			let that=this
			let opts = {
				url: 'SpareApi/GetSceneIndexConfig',
				method: 'get'
			}
			request1.httpTokenRequest(opts).then(res => {
				if(res.data.code == 1){
					that.IsVerify=res.data.data.IsVerify
					that.showWorkOrderPool=res.data.data.showWorkOrderPool
					that.isSceneAcceptSign=res.data.data.isSceneAcceptSign;
					if(res.data.data.IsVerify){
						that.goodsNav=4
					}
					that.setNav(that.goodsNav)
				}else{
					that.GetUserRole();
				}
			});
		},
		selectAssign(ids){
			let that=this
			if(ids.length==0){
				uni.showToast({ title:'请选择人员或部门', icon: 'none' });
				this.$refs.treePicker._show();
			}else{
				let opts = {
					url: 'api/QrcodeSceneAssignUserOrDepart',
					method: 'post'
				}
				let getdata={
					sceneId:that.sceneAssignId,
					sceneUserOrDepart:ids 
				}
				request1.httpTokenRequest(opts,getdata).then(res => {
					uni.hideLoading();
					if(res.data.code == 1){
						uni.showToast({ title: '指派成功', icon: 'none' });
						setTimeout(() => {
							 uni.reLaunch({
								url: '/pages/index/tabbar?PageCur='+'index'
							 });
						}, 1000)
					}
					else{
						uni.showToast({ title: res.data.msg, icon: 'none' ,duration:4000 });
					}
				});
			}
		},
		goWhere(value,id,qrcodeId){
			let that=this
			//console.log(value)
			if(value=='assign'){
				//指派
				//打开弹窗
				let opts = {
					url: 'api/GetDepartmentTreeList',
					method: 'get'
				};
				uni.showLoading({
					title: '加载中'
				})
				let GetDepartmentTreeListPara={
					type:'notall'
				}
				request1.httpTokenRequest(opts,GetDepartmentTreeListPara).then(res => {
					uni.hideLoading();
					if(res.data.code == 1){
						that.treeUserList=res.data.data
						that.sceneAssignId=id
						this.$refs.treePicker._show();
					}else{
						uni.showToast({ title: '人员架构获取失败', icon: '/static/cha.png' });
					}
				})
				//that.assignOld(id);
			}
			//驳回
			if(value=='reback'){
				uni.showModal({
					title: '提示',
					content: '确认驳回工单吗？',
					success: function (res) {
						if (res.confirm) {
							//that.reback(id,2);
							uni.navigateTo({
								url: '/pages-scene/reback?id='+id
							})
						}
					}
				});
			}
			//主动撤回
			if(value=='recall'){
				uni.showModal({
					title: '提示',
					content: '确认撤回工单吗？',
					success: function (res) {
						if (res.confirm) {
							that.reback(id,1);
						}
					}
				});
			}
			//处理
			if(value=='handle'){
				that.handle(id,qrcodeId);
			}
			//评论
			if(value=='comment'){
				that.goComment(id);
			}
			//结案
			if(value=='end'){
				that.goEnd(id);
			}
			//验收通过
			if(value=='accept'){
				uni.showModal({
					title: '提示',
					content: '确认验收工单吗？',
					success: function (res) {
						if (res.confirm) {
							that.acceptScene(id);
						}
					}
				});
			}
			//验收不通过
			if(value=='notaccept'){
				that.notAcceptScene(id);
			}
			//||value=='notverify' 审核不通过
			if(value=='notverify'){
				that.notVerifyScene(id);
			}
			//审核通过
			if(value=='verify'){
				uni.showModal({
					title: '提示',
					content: '确认审核通过工单吗？',
					success: function (res) {
						//审核通过
						//是否需要签字
						let opts = {
							url: 'api/verifyScene',
							method: 'get'
						};
						let params={
							id:id,
							isok:1,
							content:''
						};
						request1.httpTokenRequest(opts,params).then(res => {
							uni.hideLoading();
							if(res.data.code == 1){
								uni.showToast({ title: '更新成功', icon: '/static/success.png' });
								that.refresh()
							}
							else{
								uni.showToast({ title: res.data.msg, icon: 'none' });
							}
						});
					}
				});
			}
			
			//主动接单
			if(value=='receiving'){
				uni.showModal({
					title: '提示',
					content: '确认接单吗？',
					success: function (res) {
						if (res.confirm) {
							that.receivingScene(id);
						}
					}
				});
			}
			//放弃接单
			if(value=='reReceiving'){
				uni.showModal({
					title: '提示',
					content: '确认放弃接单吗？',
					success: function (res) {
						if (res.confirm) {
							that.reReceivingScene(id);
						}
					}
				});
			}
		},
		notVerifyScene(id){
			//console.log('notVerifyScene')
			uni.navigateTo({
				url: '/pages-scene/sceneverify?id='+id
			})
		},
		notAcceptScene(id){
			//console.log('notAcceptScene')
			uni.navigateTo({
				url: '/pages-scene/sceneaccept?id='+id
			})
		},
		reReceivingScene(id){
			//放弃工单
			var that = this;
			let opts = {
				url: 'api/reReceiving',
				method: 'get'
			};
			let params={
				id:id,
			};
			request1.httpTokenRequest(opts,params).then(res => {
				uni.hideLoading();
				if(res.data.code == 1){
					uni.showToast({ title: '更新成功', icon: '/static/success.png' });
					that.refresh()
				}
				else{
					uni.showToast({ title: res.data.msg, icon: 'none' });
				}
			});
		},
		receivingScene(id){
			//主动接单
			var that = this;
			let opts = {
				url: 'api/receiving',
				method: 'get'
			};
			let params={
				id:id,
			};
			request1.httpTokenRequest(opts,params).then(res => {
				uni.hideLoading();
				if(res.data.code == 1){
					uni.showToast({ title: '接单成功', icon: '/static/success.png' });
					that.refresh()
				}
				else{
					uni.showToast({ title: res.data.msg, icon: 'none' ,duration:4000 });
				}
			});
		},
		acceptScene(id){
			//验收通过
			var that = this;
			//console.log(that.isSceneAcceptSign)
			//是否需要签字
			if(that.isSceneAcceptSign==0){
				let opts = {
					url: 'api/acceptScene',
					method: 'get'
				};
				let params={
					id:id,
					isok:1,
					content:''
				};
				request1.httpTokenRequest(opts,params).then(res => {
					uni.hideLoading();
					if(res.data.code == 1){
						uni.showToast({ title: '更新成功', icon: '/static/success.png' });
						that.refresh()
					}
					else{
						uni.showToast({ title: res.data.msg, icon: 'none' });
					}
				});
			}else{
				uni.navigateTo({
					url: '/pages-others/sign?id='+id
				})
			}
			
		},
		goEnd(id){
			//结案
			var that = this;
			let opts = {
				url: 'api/EndScene',
				method: 'get'
			};
			let params={
				id:id
			};
			request1.httpTokenRequest(opts,params).then(res => {
				uni.hideLoading();
				if(res.data.code == 1){
					uni.showToast({ title: '更新成功', icon: '/static/success.png' });
					that.refresh()
				}
				else{
					uni.showToast({ title: res.data.msg, icon: 'none' });
				}
			});
		},
		assignOld(id){
			//console.log('assignOld')
			uni.navigateTo({
				url: '/pages-device/workflow/searchUser?id='+id
			})
		},
		goComment(id){
			//console.log(id)
			uni.navigateTo({
				url: '/pages-scene/comment?id='+id
			})
		},
		reback(id,type){
			//管理员驳回工单
			//this.id
			var that = this;
			
			let opts = {
				url: 'api/reBackScene',
				method: 'get'
			};
			if(type==1){
				opts.url="api/reCallScene"
			}
			let params={
				id:id
			}
			request1.httpTokenRequest(opts,params).then(res => {
				uni.hideLoading();
				if(res.data.code == 1){
					uni.showToast({ title: '更新成功', icon: '/static/success.png' });
					that.queryAllList(1,10);
				}
				else{
					uni.showToast({ title: res.data.msg, icon: 'none' });
				}
			});
		},
		handle(id,qrcodeId){
			//处理工单
			uni.getStorage({
				key: 'userdata',
				success: function (res1) {
					//console.log(res1)
					uni.navigateTo({
						url: '/pages-scene/scene/handle?id='+id+'&isSceneFactory='+res1.data.isSceneFactory+'&qrcodeId='+qrcodeId
					})
				},fail() {
					uni.navigateTo({
						url: '/pages-scene/scene/handle?id='+id+'&isSceneFactory=0'+'&qrcodeId='+qrcodeId
					})
				}
			});
		},
		// 指派确定事件
		confirm(data) {
			if(data.length==0){
				uni.showToast({ title: "请选择人员" ,icon: 'none' });
				return
			}
			let that=this
			////console.log(data);
			let users= data.map((el) => el.value).join(",");
			uni.showLoading({
				title: '提交中'
			})
			//加载人员数据
			let opts = {
				url: 'api/QrcodeSceneAssign',
				method: 'get'
			};
			
			that.params.sceneid=that.id
			that.params.sceneuser=users
			request.httpTokenRequest(opts,that.params).then(res => {
				uni.hideLoading();
				if(res.data.code == 1){
					uni.showToast({ title: '更新成功', icon: '/static/success.png' });
					setTimeout(() => {
						 uni.reLaunch({
							url: '/pages/index/tabbar?PageCur=index'
						 });
					}, 1000)
				}
				else{
					uni.showToast({ title: res.data.msg, icon: 'none' });
				}
			});
		},
		setNav(goodsNav) {
			console.log('setNav')
			let that=this
			that.goodsNav = goodsNav
			that.getData.type=goodsNav
			that.getData.pageindex=1;
			that.getData.pagesize=10;
			that.dataAdminList=[]
			//this.$refs.pagingzhipai.reload();
			//console.log('pageindex:'+that.getData.pageindex)
			//console.log('pageindex:'+that.getData.pagesize)
			this.$refs.pagingzhipai.reload();
			that.queryAllList(that.getData.pageindex,that.getData.pagesize);
		},
		result(val) {
			let that=this		
			//{"sceneStatus":"4","user":"599621014271299584"}
			let sceneStatus=val.sceneStatus
			let user=val.user
			let qrcode=val.qrcode
			let project=val.project
			let timeList=val.timeList
			if(sceneStatus!=''){
				that.getData.status=sceneStatus
			}else{
				that.getData.status=-1
			}
			//添加人，暂时隐藏
			if(user!=''){
				that.getData.adduser=user
			}else{
				that.getData.adduser=-1
			}
			//handeluser
			if(user!=''){
				that.getData.handeluser=user
			}else{
				that.getData.handeluser=-1
			}
			//console.log(qrcode)
			if(qrcode!=''){
				that.getData.qrcodeid=qrcode
			}else{
				that.getData.qrcodeid=-1
			}
			// if(project!=''){
			// 	that.getData.projectId=project
			// }else{
			// 	that.getData.projectId=-1
			// }
			if(timeList!=''){
				that.getData.timeList=timeList
			}else{
				that.getData.timeList='3m'
			}
			that.dataAdminList=[]
			that.queryAllList(that.getData.pageindex,that.getData.pagesize);
			
		},
		resetMenuList(){
			//console.log('resetMenuList')
		},
		getSearchOptions(){
			//console.log('getSearchOptions')
			let that=this
			let opts = {
				url: 'api/GetSceneSearchOptions',
				method: 'get'
			}
			request1.httpTokenRequest(opts).then(res => {
				uni.hideLoading();
				if(res.data.code == 1){
					let allPersonList=res.data.data.user
					let allProjectList=res.data.data.project
					let timeList=res.data.data.timeList
					//用户
					if(allPersonList.length>0){
						let datalist=[]
						let entity={
							title:'不限',
							value:''
						}
						datalist.push(entity)
						for(let i=0;i<allPersonList.length;i++){
							let entity={
								title:allPersonList[i].RealName,
								value:allPersonList[i].Id
							}
							datalist.push(entity)
						}
						that.menuList[1].detailList=datalist
					}
					
					
					let allQrcode=res.data.data.qrcode
					//点位
					if(allQrcode.length>0){
						let datalist=[]
						let entity={
							title:'不限',
							value:''
						}
						datalist.push(entity)
						for(let i=0;i<allQrcode.length;i++){
							let entity={
								title:allQrcode[i].qrcode_title,
								value:allQrcode[i].Id
							}
							datalist.push(entity)
						}
						that.menuList[2].detailList=datalist
					}
					
					//项目
					// if(allProjectList.length>0){
					// 	let datalist=[]
					// 	let entity={
					// 		title:'不限',
					// 		value:''
					// 	}
					// 	datalist.push(entity)
					// 	for(let i=0;i<allProjectList.length;i++){
					// 		let entity={
					// 			title:allProjectList[i].ProjectName,
					// 			value:allProjectList[i].Id
					// 		}
					// 		datalist.push(entity)
					// 	}
					// 	that.menuList[3].detailList=datalist
					// }
					
					
					//时间
					if(timeList.length>0){
						let datalist=[]
						// let entity={
						// 	title:'近三个月',
						// 	value:'3m'
						// }
						//datalist.push(entity)
						for(let i=0;i<timeList.length;i++){
							let entity={
								title:timeList[i].Name,
								value:timeList[i].Time
							}
							datalist.push(entity)
						}
						that.menuList[3].detailList=datalist
					}
				}
				else{
					uni.showToast({ title: res.data.msg, icon: 'none' });
				}
			});
			
		},
		refresh(){
			//console.log('refresh')
			let that=this
			that.dataAdminList=[]
			//that.queryAllList(1,10);
			this.$refs.pagingzhipai.reload();
		},
		//
		queryAllList(pageNo, pageSize) {
			console.log('queryAllList')
			//console.log('pageNo:'+pageNo)
			//console.log('pageSize:'+pageSize)
			uni.showLoading({
				title: '加载中'
			})
			var that = this;
			let opts = {
				url: 'api/GetQrcodeSceneListNew',
				method: 'get'
			};
			that.showDaiBan=0
			that.showWorkOrder=0
			that.verifyCount=0
			that.getData.pageindex=pageNo;
			that.getData.pagesize=pageSize;
			request1.httpTokenRequest(opts,that.getData).then(res => {
				if(res.data.code == 1){
					uni.hideLoading();
					that.showDaiBan=res.data.data.count
					that.showWorkOrder=res.data.data.workOrder
					that.verifyCount=res.data.data.verifyCount
					this.$refs.pagingzhipai.complete(res.data.data.list);
					
				}
				else{
					uni.showToast({ title: res.data.msg, icon: 'none' });
				}
			});
		},
		createScene(){
			uni.navigateTo({
				url: '/pages/qrcode/scene/add/add'
			})
		},
		goClass(id,desc){
			uni.getStorage({
				key: 'userdata',
				success: function (res1) {
					uni.navigateTo({
						url: '/pages-scene/scene/detail?id='+id+'&desc='+desc+'&IsAdmin='+res1.data.IsAdmin
					})
				}
			});
		},
		reachBottom() {
			// 此tab为空数据
			if(this.current != 2) {
			}
		},
		// tab栏切换
		change(index) {
			this.swiperCurrent = index;
		},
		transition({ detail: { dx } }) {
			this.$refs.tabs.setDx(dx);
		},
		animationfinish({ detail: { current } }) {
			this.$refs.tabs.setFinishCurrent(current);
			this.swiperCurrent = current;
			this.current = current;
		},
		createSceneByScan(){
			let that = this;
			uni.scanCode({
				onlyFromCamera: false,
				success: function(res) {
					let qrcodeId=request1.getRequest(res.result,'id')
					//跳转添加页面
					uni.navigateTo({
						url: '/pages/qrcode/scene/add/add?qrcodeid='+qrcodeId
					})
				},fail() {
					uni.hideLoading();
				}
			});
		}
	}
};
</script>

<style lang="scss" scoped>
/* #ifndef H5 */
page {
	height: 100%;
	background-color: #f2f2f2;
}
/* #endif */
</style>

<style lang="scss" scoped>
	.bxImg{
		margin-right: 20rpx;
	}
.zp-container{
	.zp-main{
		margin-top: -400rpx !important;
	}
}
.order {
	width: 710rpx;
	background-color: #ffffff;
	margin: 20rpx auto;
	border-radius: 20rpx;
	box-sizing: border-box;
	padding: 20rpx;
	font-size: 28rpx;
	.top {
		display: flex;
		justify-content: space-between;
		.left {
			display: flex;
			align-items: center;
			.store {
				margin: 0 10rpx;
				font-size: 34rpx;
				font-weight: bold;
			}
		}
		.right {
			color: $u-type-warning-dark;
			.progressBox{
				width: auto;
				float: right;
				.btn {
					padding-left: 18rpx;
					padding-right: 18rpx;
					line-height: 52rpx;
					width: auto;
					border-radius: 12rpx;
					border: 2rpx solid $u-tips-color;
					font-size: 26rpx;
					text-align: center;
					color: $u-tips-color;
				}
				.evaluate {
					color: $u-type-primary;
					border-color: $u-type-primary;
				}
			}
		}
	}
	.item {
		display: flex;
		margin: 20rpx 0 0;
		.left {
			margin-right: 20rpx;
			image {
				width: 260rpx;
				height: 190rpx;
				border-radius: 10rpx;
			}
		}
		.content {
			.title {
				font-size: 28rpx;
				line-height: 45rpx;
			}
			.type {
				margin: 6rpx 0;
				font-size: 24rpx;
				color: $u-tips-color;
				text-overflow: -o-ellipsis-lastline;
				overflow: hidden;
				text-overflow: ellipsis;
				display: -webkit-box;
				-webkit-line-clamp: 3;
				line-clamp: 3;
				-webkit-box-orient: vertical;
			}
			.delivery-time {
				color: #0081ff;
				font-size: 24rpx;
			}
		}
		.right {
			margin-left: 10rpx;
			padding-top: 20rpx;
			text-align: right;
			.decimal {
				font-size: 24rpx;
				margin-top: 4rpx;
			}
			.number {
				color: $u-tips-color;
				font-size: 24rpx;
			}
		}
	}
	.total {
		margin-top: 20rpx;
		text-align: right;
		font-size: 24rpx;
		.total-price {
			font-size: 32rpx;
		}
	}
	.bottom {
		line-height: 70rpx;
		display: flex;
		//justify-content: space-between;
		align-items: center;
		.btnBox{
			width: 150rpx;
			display: flex;
			justify-content: space-between;
			float:right;
		
			.btn {
				line-height: 52rpx;
				width: 140rpx;
				border-radius: 26rpx;
				border: 2rpx solid $u-tips-color;
				font-size: 26rpx;
				text-align: center;
				color: $u-tips-color;
			}
			.evaluate {
				color: $u-type-primary;
				border-color: $u-type-primary;
			}
		}
	}
}
.centre {
	text-align: center;
	margin: 200rpx auto;
	font-size: 32rpx;
	image {
		width: 300rpx;
		border-radius: 50%;
		margin: 0 auto;
	}
	.tips {
		font-size: 24rpx;
		color: #999999;
		margin-top: 20rpx;
	}
	.btn {
		margin: 80rpx auto;
		width: 200rpx;
		border-radius: 32rpx;
		line-height: 64rpx;
		color: #ffffff;
		font-size: 26rpx;
		background: linear-gradient(270deg, #1cbbb4 0%, #0081ff 100%);
	}
}
.wrap {
	display: flex;
	flex-direction: column;
	height: calc(100vh - var(--window-top));
	width: 100%;
}
.swiper-box {
	flex: 1;
	//padding-bottom: 240rpx;
}
.swiper-item {
	height: 100%;
}

	.goods-option-item {
		padding: 8rpx 16rpx;
		border-radius: 36rpx;
		font-size: 24rpx;
		margin-top: 24rpx;
	}

	.goods-option-item:not(:last-child) {
		margin-right: 24rpx;
	}

	.goods-option-item-action {
		background: #f1f0fe;
		color: #6991ce;
	}

	.goods-item-wrap {
		margin-top: 24rpx;
	}

	.goods-header-wrap {
		display: flex;
		align-items: center;
		padding: 24rpx;
		background: #FFFFFF;
		margin-bottom: 10rpx;
	}
	.goods-header-item-active{
		font-size: 36rpx;
		font-color: #333333;
		font-weight: bold;
		position: relative;
	}
	.goods-header-item-active::after{
		position: absolute;
		left: 0;
		right: 0;
		background: #4372fe;
		height: 8rpx;
		content: "";
		bottom: -12rpx;
	}
	.goods-header-item-action {
		// font-size: 32rpx;
		// font-color: #333333;
		// font-weight: bold;
		position: relative;
	}

	.goods-header-item-action::after {
		// position: absolute;
		// left: 0;
		// right: 0;
		// background: #4372fe;
		// height: 8rpx;
		// content: "";
		// bottom: -12rpx;
	}
	.extraPosition{
		position: absolute;
		right: -5rpx;
		top: -10rpx;
		font-size: 20rpx;
		padding: 0rpx 10rpx;
		height: 28rpx;
		color: #ffffff;
		background-color: #dd514c;
		display: inline-flex;
		align-items: center;
		justify-content: center;
	}
	.goods-header-item {
		margin-right: 42rpx;
	}
</style>

